﻿@{
    Layout = null;
}

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <meta name="viewport" content="width=device-width" />
    <title>Admin Surveys</title>
    @Styles.Render("~/Content/Site.css")

    <script type="text/javascript">
        var baseUrl = '@ViewBag.BaseUrl';
    </script>
</head>
<body>
    <div id="wrapper" class="admin">        
	    <header>
		    <h2>Admin Surveys</h2>
	    </header>
	    <section id="middle">
		    <div id="container">
                <div id="detail">
                    <script type="text/x-handlebars">
                    {{#if App.selectedSurveyController.content}}
                    {{#view App.SurveyDetailsView}}
                        <div class="name">
                            {{editable "content.Name" required="true"}}
                        </div>                                
                        {{#button action="deleteSurvey" class="delete-survey"}}Delete Survey{{/button}}
                        <div class="description">
                            {{editable "content.Description" isMultiline="true"}}
                        </div>
                        <div class="description">
                            {{#view Ember.Link hrefBinding="content.createUrl" valueBinding="content.createUrl"}}{{value}}{{/view}}
                        </div>
                        <div class="survey-questions">
                            <table>
                                <tr> 
                                    <th colspan="2">questions</th>
                                    <th class="type">type</th>
                                    <th class="actions"></th>
                                </tr>
                                {{#each content.Questions}}
                                    <tr>
                                        <td class="index">{{index}}. </td>
                                        <td>{{editable description}}</td>
                                        <td>{{editable type templateName="edit-field-selectQuestionType"}}</td>
                                        <td>{{view App.DeleteQuestionView contentBinding="this"}}</td>
                                    </tr>
                                {{/each}}
                            </table>                        
                        </div>
                        {{#view Ember.Button target="contentView" action="addQuestion" class="add-question"}}
                            Add Question
                        {{/view}}
                    {{/view}}

                    {{else}}
                        <div class="no-survey-selected">No survey selected.</div>
                    {{/if}}
                    </script>
                </div>
            </div>

            <div id="survey-list">
                <script type="text/x-handlebars">
                <ul>
                    {{#each App.surveysController}}
                        {{#view App.SurveyListView contentBinding="this"}}
                        {{#with content}}
                            <li>
                                <ul class="more-info">
                                    <li class="header">{{Name}}</li>
                                    <li class="more publish-date" style="display:none;">publish date<span>N/A</span></li>
                                    <li class="more notes" style="display:none;">notes<span>N/A</span></li>
                                    <li class="more stats" style="display:none;">stats
                                        <span>
                                            {{#view Ember.Link hrefBinding="createSummaryUrl" value="View Summary"}}{{value}}{{/view}}
                                        </span>
                                    </li>
                                </ul>
                            </li>
                        {{/with}}
                        {{/view}}
                    {{/each}}
                </ul>
                </script>
            </div>
        </section>
    </div>

    <footer>
        <script type="text/x-handlebars">
            {{#button action="newSurvey" class="new-survey"}}New Survey{{/button}}
            <a class="help" href="../Help/help.html">Help</a>
        </script>
    </footer>

    <script type="text/x-handlebars" data-template-name="edit-field">
    {{#if isEditing}}
        {{#if isMultiline}}
            {{view App.TextArea valueBinding="value" propagatesEvents=true}}
        {{else}}
            {{view App.TextField valueBinding="value" propagatesEvents=true}}
        {{/if}}
    {{else}}
        {{#if value}}
            {{value}}
        {{else}}
            <span class="no-name">empty</span>
        {{/if}}
    {{/if}}
    </script>

    <script type="text/x-handlebars" data-template-name="edit-field-selectQuestionType">
    {{#if isEditing}}
        {{view App.SelectField 
                contentBinding="App.QuestionTypes" 
                selectionBinding="value"
                propagatesEvents=true}}
    {{else}}
        {{value}}
    {{/if}}
    </script>
    @Scripts.Render("~/Scripts/jquery-1.6.4.js")
    @Scripts.Render("~/Scripts/ember-0.9.8.1.js")
    @Scripts.Render("~/Scripts/flotr2.js")
    @Scripts.Render("~/Scripts/adminApp.js")
</body>
</html>
